<template>
  <div class="container">
    <div class="common-header">
      <van-nav-bar
        title="管理员登录"
        left-text="返回"
        left-arrow
        @click-left="onClickLeft"
      />
    </div>
    <div class="login-box">
      <van-form @submit="onSubmit">
        <van-field
          v-model="loginForm.account"
          name="account"
          label="账号"
          placeholder="请输入仓管账号"
          :rules="[{ required: true }]"
        />
        <van-field
          v-model="loginForm.password"
          type="password"
          name="password"
          label="密码"
          placeholder="请输入密码"
          :rules="[{ required: true }]"
        />
        <div style="margin: 16px">
          <van-button round block type="info" native-type="submit"
            >Login</van-button
          >
        </div>
      </van-form>
    </div>
  </div>
</template>

<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import { managerLogin, managerInfo } from "@/api/manager";

@Component({
  components: {},
})
export default class HomeView extends Vue {
  // 登录表单
  private loginForm: any = {
    account: "",
    password: "",
  };
  // 返回
  private onClickLeft(): void {
    this.$router.go(-1);
  }
  // 登录
  private onSubmit(): void {
    managerLogin(this.loginForm).then((res) => {
      localStorage.setItem("manager-token", (res as any).data);
      managerInfo().then((info) => {
        localStorage.setItem("managerInfo", JSON.stringify(info.data));
        this.$router.push("/manager-index");
      });
    });
  }
}
</script>
<style lang="scss" scoped>
.container {
  width: 100%;
  height: 100%;
  overflow: hidden;
  .common-header {
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 99;
  }
  .login-box {
    margin-top: 50px;
    ::v-deep .van-cell {
      padding: 20px 16px !important;
      font-size: 16px !important;
    }
    ::v-deep .van-field__label {
      width: 3rem;
    }
    ::v-deep .van-field__error-message {
      font-size: 15px !important;
    }
  }
}
</style>
